<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>添加信息</title>
    <style>
        body {
            font-family: Arial, Helvetica, sans-serif;
            padding: 20px;
        }
        td {
            padding: 10px;
        }
        table {
            width: 60%;
            margin: 0 auto;
            border-collapse: collapse;
            text-align: left;
        }
        table, th, td {
            border: 1px solid #ddd;
        }
        input[type="submit"], input[type="reset"] {
            background-color: #4CAF50;
            color: white;
            padding: 12px 20px;
            margin: 8px 0;
            border: none;
            cursor: pointer;
        }
        #tip {
            color: red;
        }
    </style>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.js"></script>
</head>
<body>

<form method="post" action="add">
    <table>
        <tr>
            <td>部门ID：
                <input type="text" id="dept_id" name="dept_id">
            </td>
        </tr>

        <tr>
            <td>登录账号：
                <input type="text" id="login_name" name="login_name" onblur="checkExist(this.value)">
                <span id="tip" style="color: red"></span>
            </td>
        </tr>
        <tr>
            <td>用户昵称：
                <input type="text" id="user_name" name="user_name">
            </td>
        </tr>

        <tr>
            <td>用户类型：
                <input type="text" name="user_type">
            </td>
        </tr>


        <tr>
            <td>用户邮箱：
                <input type="text" name="email">
            </td>
        </tr>

        <tr>
            <td>手机号码：
                <input type="text" name="phonenumber">
            </td>
        </tr>


        <tr>
            <td>用户性别：
                <input type="radio" name="sex" value="0" checked/>男
                <input type="radio" name="sex" value="1" />女
            </td>


        </tr>

        <tr>
            <td>密码：
                <input type="text" name="password">
            </td>
        </tr>

        <tr>
            <td>最后登录IP：
                <input type="text" name="login_ip">
            </td>
        </tr>

        <tr>
            <td colspan="2" align="center">
                <input type="submit" id="submit" value="添加">
                <input type="reset" id="reset" value="重置">
            </td>
        </tr>

    </table>
</form>
<script>
    function checkExist(value){
        $.ajax({
            type:'get',
            url:'checkExist',
            data:'account='+$('#login_name').val(),
            success:function(data){
                console.log(data)
                if (data=="1"){
                    $('#tip').html('该账号已存在');
                }else {
                    $('#tip').html('');
                }
            }
        })
    }

    $(function () {
        $('form').submit(function (){
            let  account=$('#login_name').val();
            if (account==''){
                alert('账号不能为空')
                return false;
            }
            let  realName=$('#实际存在的id').val();
            if (realName==''){
                alert('姓名不能为空')
                return  false;
            }
        })
    })
</script>
<!-- Your original scripts -->

</body>
</html>